const path = require('path')
const webpack = require('webpack')
const CompressionPlugin = require('compression-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const isProd = process.env.NODE_ENV === 'production'

// 项目目录
const cdn = {
  css: [],
  js: [
      'https://cdn.staticfile.org/vue/2.6.11/vue.min.js',
      'https://cdn.staticfile.org/vue-router/3.2.0/vue-router.min.js',
      'https://libs.cdnjs.net/axios/0.19.2/axios.min.js',
  ]
}
const baseUrl = '/'
function resolve (dir) {
  return path.join(__dirname, dir)
}
module.exports = {
  publicPath: isProd ? baseUrl : '/',
  lintOnSave: false,
  outputDir: 'dist',
  assetsDir: 'static',
  productionSourceMap:false,
  devServer: {
    disableHostCheck: true,
    port: 8077, // 端口号
    host: '0.0.0.0',
    https: false,
  },  
  chainWebpack: config => {
    // // 配置别名
    config.resolve.alias
        .set("@", resolve("src"))
        .set("@pages", resolve("src/views"))
        .set("@img", resolve("src/assets/images"))
        // 生产环境配置
    // config.plugins.delete('preload');
    // config.plugins.delete('prefetch');
    if (isProd) {
        //压缩代码
        config.optimization.minimize(true);
        //分割代码
        config.optimization.splitChunks({
                chunks: 'all'
            })
            // 生产环境注入cdn
        config.plugin('html')
            .tap(args => {
                args[0].cdn = cdn;
                return args;
            });
    }
   },                           
  // 开启gzip 压缩
  configureWebpack: (config) => {
    const plugins = [];
    if (isProd) {
      // 用cdn方式引入
      config.externals = {
              'vue': 'Vue',
              'vue-router': 'VueRouter',
              'axios': 'axios'
          }
          //生产环境自动删除console
        config.optimization.minimizer[0].options.terserOptions.compress.warnings = false;
        config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true;
        config.optimization.minimizer[0].options.terserOptions.compress.drop_debugger = true;
        config.optimization.minimizer[0].options.terserOptions.compress.pure_funcs = ['console.log'];
        config.optimization.minimizer[0].options.sourceMap = false;
        config.optimization.minimizer[0].options.parallel = true;
     }
    // 代码分隔
    // plugins.push(
    //   new webpack.optimize.SplitChunksPlugin({
    //       chunks:"all",
    //       minSize: 10000,
    //       maxSize: 0,
    //       minChunks: 1,
    //       maxAsyncRequests: 2,
    //       maxInitialRequests: 3,
    //       automaticNameDelimiter: '~',
    //       name: true,
    //       cacheGroups: {
    //         vue: {
    //           name: 'plugn',
    //           test: (module) => {
    //               return /vue|vuex/.test(module.context);
    //           },
    //           chunks: 'initial',
    //           priority: 10,
    //         },
    //         iview: {
    //               test: (module) => {
    //                 return /iview|IVIEW|view-design/.test(module.context);
    //             },
    //             priority: 9,
    //             name: 'iview_base'
    //         },
    //         commons: {
    //           name: 'common',
    //           chunks: 'initial',
    //           priority: 2,
    //           minChunks: 2,
    //         },
    //       }
    //   }),
    // )
    // return {
    //   plugins,
    //   performance: {
    //     hints:'warning',
    //     //入口起点的最大体积
    //     maxEntrypointSize: 50000000,
    //     //生成文件的最大体积
    //     maxAssetSize: 30000000,
    //     //只给出 js 文件的性能提示
    //     assetFilter: function(assetFilename) {
    //       return assetFilename.endsWith('.js');
    //     }
    //   }
    // }
  },
  css: {
    // loaderOptions: {
    //     less: {
    //         lessOptions: {
    //             javascriptEnabled: true
    //         }
    //       } 
    // },
    // 是否使用css分离插件 ExtractTextPlugin
    //extract: true,
    // 开启 CSS source maps?
    // sourceMap: false,
    // requireModuleExtension: false,
}
}
function addStyleResource (rule) {
  rule.use('style-resource')
    .loader('style-resources-loader')
    .options({
      patterns: [
        // 全局共享样式
        path.resolve(__dirname, './src/assets/css/variables.scss'),
        path.resolve(__dirname, './src/assets/css/common.scss')
      ]
    })
}